<!DOCTYPE html>
<html lang="en">
<!-- 添加文章 作者：刘婷婷 -->

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>添加文章</title>
    <link rel="stylesheet" href="../../layui/css/layui.css">
</head>

<body>
    <!-- 作者：刘婷婷 -->
    <fieldset class="layui-elem-field layui-field-title">
        <legend>
            <button class="layui-btn layui-btn-sm" id="back">返回</button>
            <span id="spantitle"></span>
        </legend>
    </fieldset>
    <form class="layui-form" action="" lay-filter="article">

        <div class="layui-form-item">
            <label class="layui-form-label">文章标题</label>
            <div class="layui-input-block">
                <input type="text" style="width:1000px" name="title" required lay-verify="required" placeholder="请输入文章名称" autocomplete="off" class="layui-input"
                    id="txt_in">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="test1" placeholder="yyyy-MM-dd">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">内容</label>
                <div class="layui-input-block">
                    <div id="editor">

                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="formDemo" id="but">添加文章
                        <tton>
                            <button type="reset" class="layui-btn layui-btn-primary">重置
                                <tton>
                </div>
            </div>
    </form>
    <img src="" alt="">
    <script src="../../layui/layui.js"></script>
    <script src="../../js/jquery-1.12.4.min.js"></script>
    <script src="../../js/lodash.min.js"></script>
    <script src="../../editor/wangEditor.min.js"></script>

    <script>
        var E = window.wangEditor
        var editor = new E('#editor')
        editor.customConfig.uploadImgServer = '/api/upload'  // 上传图片到服务器
        editor.customConfig.uploadFileName = 'imgfile'//上传文件域名
        editor.customConfig.uploadImgHooks = {
            customInsert: function (insertImg, result, editor) {
                var url = result.data[0]
                insertImg(url)
            }
        }

        editor.create();
        const obj = query(location.href);
        let times;
        time();
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
                elem: '#test1' //指定元素
                , value: times
            });
        });
        //得到修改对象
        async function time() {
            const nivea = await $.ajax({
                url: "/api/Article/" + obj.id,
                method: "get",
            });
            var d = new Date(nivea.data.publishDate);
            times = d.getFullYear() + '-' + (d.getMonth() + 1) + '-' + d.getDate();
            return nivea;
        }
        async function Obtain() {
            const nivea = await time();
            editor.txt.html("<p>" + nivea.data.content + "</p>")
        }
        layui.use('form', async function () {
            const form = layui.form;
            if (obj.id) {
                Obtain();
                console.log("这是修改");
                $("#but").text("修改文章");
                $("#spantitle").text("修改文章");
                const nivea = await time();
                nivea.data.publishDate = times;
                form.val("article", nivea.data);
                form.on('submit(formDemo)', function (data) {
                    const title = $("#txt_in").val();
                    const t = $("#test1").val();
                    const html = editor.txt.html();
                    const description = editor.txt.text();
                    // console.log(html);
                    $.ajax({
                        url: "/api/Article/" + obj.id,
                        method: "put",
                        data: {
                            title,
                            publishDate: t,
                            content: html,
                            description
                        },
                        success: function () {
                            location.href = "./index.html"
                        }
                    })
                })
            }
            else {
                $("#spantitle").text("添加文章");
                $("#but").text("添加文章");
                //监听提交
                form.on('submit(formDemo)', function (data) {
                    $.ajax({
                        url: "/api/Article/",
                        method: "post",
                        data: {
                            title: $("#txt_in").val(),
                            publishDate: $("#test1").val(),
                            content: $("#editor").text()
                         

                        },
                        success: function () {
                            location.href = "./index.html"
                        }
                    })
                    return false;
                });
            }
        })
        //得到单个
        // 作者：刘婷婷
        async function getarticle() {
            const nivea = await $.ajax({
                url: "/api/Article/" + obj.id,
                method: "get",
            });

            return nivea;
        }

        async function article() {
            const cle = await $.getJSON("");
            return;
        }

        //Demo
        //返回
        $("#back").click(function () {
            location.href = "./index.html";
        })

        function query(url) {
            const parts = url.split("?");
            if (parts.length == 1) {//地址中没有参数
                return {};
            }
            const obj = {};
            parts[1].split("&").map(item => item.split("=")).forEach(([p, v]) => {
                obj[p] = decodeURIComponent(v);
            });
            return obj;
        }

    </script>
</body>

<ml>